<!DOCTYPE html>
<html class="no-js css-menubar" lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
        <meta name="description" content="bootstrap admin template">
        <meta name="author" content="">
        <script type="text/javascript" src="../_resource/js/header.js"></script>
        <script>
            var RUN_FUNCS = [];
            var SITE_URL = "http://admin.html.me";
            var CURR_CONTROLLER = "Article";
            var CURR_ACTION = "index";
            Breakpoints();
        </script>
        <style type="text/css">
            .list-table table td, .list-table table th{background:#fff; text-align:center;}
            .__access{display: none;}
        </style>
    </head>
    <body class="dashboard">
        <!--[if lt IE 8]>
        <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
        <nav class="site-navbar navbar navbar-default navbar-fixed-top navbar-mega" role="navigation" id="navbardefaultmodel">
            <script type="text/javascript" src="../_resource/js/include.js" onload="HM.SomeFun('head_html')"></script>
        </nav>
        <div class="site-menubar">
            <div class="site-menubar-body" id="site-menubar-body">
                <script type="text/javascript" src="../_resource/js/include.js" onload="HM.SomeFun('nav_html')"></script>
            </div>
        </div>

        <!-- Page -->
        <div class="page">
            <div class="page-content container-fluid">

                <div
                    class="list-table " 

                    style="" 
                    >
                    <div class="panel panel-bordered list-table-search" style="">
                        <div class="panel-body">
                            <form class="form-inline search-form " id="searchForm" name="searchForm" target="_self" onsubmit="loadNewsData();
                                    return false;">
                                <div class="search-row " style="">
                                    <div id="keywords-form-item"  class="form-group " style="" >
                                        <label for="keywords" class="control-label ">Keyword:</label>
                                        <input type="text" name="keywords" id="keywords" class="form-control " style="" placeholder=""  value="" />
                                    </div>
                                    <button class="btn btn-success" type="button" onclick="loadNewsData();" style="">Search</button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="panel " style="">
                        <div class="panel-body">
                            <div class="list-btns margin-bottom-15 " style="height: 36px;">
                                <a class="btn btn-primary __access" id="_access-news-add" href="/Article/add.html" target="_self" style="">ADD</a>
                                <a class="btn btn-danger __access" id="_access-news-delete" href="javascript:;"  target="_self" style="">Delete</a>
                                <a class="btn btn-info btn-activate __access" id="_access-news-open" href="javascript:;" target="_self" style="">Publish</a>
                                <a class="btn btn-warning btn-deactivate __access" id="_access-news-close" href="javascript:;" target="_self" style="">Unpublish</a>
                            </div>
                            <table id="tabel201709201430488112715" border="0" cellpadding="6" cellspacing="1" class="table table-bordered checkListTable" style="">
                                <thead class="list-thead">
                                    <tr>
                                        <td class="nosort" width="38" data-width="38" style="text-align:center; line-height: normal;">
                                            <span class="checkbox-custom checkbox-primary">
                                                <input class="selectable-all" type="checkbox" onclick="$.tableCheckHandler(this)">
                                                <label></label>
                                            </span>
                                        </td>
                                        <td class="" style="text-align:center;white-space:nowrap;" width="60" code="id">
                                            <span>ID</span>
                                        </td>
                                        <td class="" style="text-align:left;white-space:nowrap;" code="title">
                                            <span>Title</span>
                                        </td>
                                        <td class="" style="text-align:center;white-space:nowrap;" width="150" code="author">
                                            <span>Author</span>
                                        </td>
                                        <td class="" style="text-align:center;white-space:nowrap;" width="200" code="category_id">
                                            <span>Category</span>
                                        </td>
                                        <td class="" style="text-align:center;white-space:nowrap;" width="150" code="created_at">
                                            <span>Creation Date</span>
                                        </td>
                                        <td class="" style="text-align:center;white-space:nowrap;" width="150" code="updated_at">
                                            <span>Edit Date</span>
                                        </td>
                                        <td class="" style="text-align:center;white-space:nowrap;" width="100" code="status">
                                            <span>Status</span>
                                        </td>
                                        <td class="nosort" style="text-align:center;white-space:nowrap;" width="300" code="">
                                            <span>Action</span>
                                        </td>
                                    </tr>
                                </thead>
                                <tbody class="list-tbody" id="news-table"></tbody>
                            </table>
                            <nav class="pagination-nav" id="news-pagenation"></nav>
                            <script type="text/javascript">
                                $(document).ready(function () {
                                    window.loadNewsData = function(page = 1){
                                        var keywords = $('#keywords').val();
                                        $.setLoading($('#news-table'));
                                        Api.Get('getNewsList', {show_page: 1, is_page: 1, page_count: 20, current_page: page, keywords: keywords, order_by: JSON.stringify({'status': 'desc', 'id': 'desc'}), news_status: JSON.stringify([1, 2])}, function (object, error) {
                                            if (object['message'] && object['status_code'] && object['message'] == 'OK' && object['status_code'] == 200) {
                                                $.setLoading($('#news-table'), 1);
                                                var tableHtml = '', trNums = object['data']['data'].length;
                                                for (var i = 0; i < trNums; ++i) {
                                                    tableHtml = tableHtml + Api.render('<tr class="tr-1 {evenOrOdd}" key="{pk}" primary="id">' +
                                                            '<td width="38" style="text-align:center; line-height: normal;">' +
                                                            '<span class="checkbox-custom checkbox-primary">' +
                                                            '<input class="selectable-item" type="checkbox"  name="key" id="row-{pk}" value="{pk}"  />' +
                                                            '<label for="row-{pk}"></label>' +
                                                            '</span>' +
                                                            '</td>' +
                                                            '<td class="" code="id" style="">{pk}</td>' +
                                                            '<td class="" code="title" style="text-align:left;"><a href="{previewUrl}" target="_blank">{title}</a></td>' +
                                                            '<td class="" code="author" style="">{author}</td>' +
                                                            '<td class="" code="category_id" style="">{categoryId}</td>' +
                                                            '<td class="" code="created_at" style="">{createTime}</td>' +
                                                            '<td class="" code="updated_at" style="">{updateTime}</td>' +
                                                            '<td class="" code="status" style="">{cateStatus}</td>' +
                                                            '<td class="list-item-action" code="" style="">' +
                                                            '<a href="{editUrl}" class="text-info {__accessClass} _access-news-eidt" data-pk="{pk}" target="_self" style="float:left;margin-left:10px;">Edit</a>' +
                                                            '<a href="{previewUrl}" class="text-info {__accessPreviewClass} _access-news-eidt" data-pk="{pk}" target="_blank" style="float:left;margin-left:10px;">Preview</a>' +
                                                            '</td>' +
                                                            '</tr>', {
                                                                'evenOrOdd': object['data']['data'][i]['id'] % 2 == 1 ? 'odd' : 'even',
                                                                'pk': object['data']['data'][i]['id'],
                                                                'previewUrl': Api.U('/preview/{aid}', {aid: object['data']['data'][i]['id']}, API_HOSTNAMES['pc']),
                                                                'title': object['data']['data'][i]['title'],
                                                                'author': object['data']['data'][i]['author'],
                                                                'categoryId': object['data']['data'][i]['category_name'],
                                                                'createTime': object['data']['data'][i]['created_at'],
                                                                'updateTime': object['data']['data'][i]['updated_at'],
                                                                'cateStatus': object['data']['data'][i]['status'] == 1 ? 'Drafts' : 'Published',
                                                                'editUrl': Api.U('/Article/edit.html', {id: object['data']['data'][i]['id']}),
                                                                '__accessClass': window.Access.isAccessToAccessId('_access-news-eidt') ? '' : '__access',
                                                                '__accessPreviewClass': '',
                                                            });
                                                }
                                                if (tableHtml) {
                                                    $('#news-table').html(tableHtml);
                                                    if ($('#news-table').data('inited') != 1) {
                                                        $('#news-table').data('inited', 1);
                                                        var minwidth = 0;
                                                        var isFixedColumns = minwidth > 0 && $('#tabel201709201430488112715').width() < minwidth;
                                                        // console.log($('#tabel201709201430488112715').width(), isFixedColumns);
                                                        var table = $('#tabel201709201430488112715').DataTable({
                                                            fixedHeader: true,
                                                            autoWidth: isFixedColumns,
                                                            scrollCollapse: true,
                                                            paging: false,
                                                            info: false,
                                                            searching: false,
                                                            scrollX: true,
                                                            order: [[0, '']],
                                                            columnDefs: [
                                                                {targets: 'nosort', orderable: false, sSortAsc: false}
                                                            ]
                                                        }).on('order.dt', function () {
                                                            var order = table.order()[0];
                                                            var code = $('thead td', this).eq(order[0]).attr('code');
                                                            // console.log(code);
                                                        });
                                                        if (isFixedColumns) {
                                                            new $.fn.dataTable.FixedColumns(table, {
                                                                leftColumns: 1,
                                                                rightColumns: 1
                                                            });
                                                        }
                                                    }
                                                }
                                                if (object['data']['show_page']) {
                                                    var pageString = Api.getAdminPagenation(totalRows = object['data']['show_page']['total'], totalPages = object['data']['show_page']['total_page'], page, window.loadNewsData);
                                                    console.log(pageString);
                                                    $('#news-pagenation').html(pageString);
                                                    $('.pagination li').click(function () {
                                                        if (!isNaN(clickPage = parseInt($(this).data('page')))) {
                                                            window.loadNewsData(clickPage);
                                                        }
                                                        return false;
                                                    });
                                                }
                                            } else {
                                                $.showError('Something Error, Retry Please.', 300, function () {
                                                    // window.location.reload();
                                                });
                                                return true;
                                            }
                                        });
                                    }
                                    loadNewsData(1);

                                    // delete
                                    $('#_access-news-delete').click(function () {
                                        $.tableMultiOperate($('#news-table'), function (ids) {
                                            if (ids.length == 0) {
                                                $.showError('Select Item To Delete, First.', 300);
                                            } else {
                                                Api.Delete('deleteNews', {id: JSON.stringify(ids)}, function (object, error) {
                                                    if (object['message'] && object['status_code'] && object['message'] == 'OK' && object['status_code'] == 200) {
                                                        $.showSuccess('Delete News Successfully.', 300, function () {
                                                            window.location.reload();
                                                        });
                                                    } else {
                                                        $.showError('Something Error, Retry Please.', 300, function () {
                                                            window.location.reload();
                                                        });
                                                    }
                                                });
                                            }
                                        });
                                    });

                                    // open
                                    $('#_access-news-open').click(function () {
                                        $.tableMultiOperate($('#news-table'), function (ids) {
                                            if (ids.length == 0) {
                                                $.showError('Select Item To Publish, First.', 300);
                                            } else {
                                                Api.Put('openNews', {id: JSON.stringify(ids)}, function (object, error) {
                                                    if (object['message'] && object['status_code'] && object['message'] == 'OK' && object['status_code'] == 200) {
                                                        $.showSuccess('Publish News Successfully.', 300, function () {
                                                            window.location.reload();
                                                        });
                                                    } else {
                                                        $.showError('Something Error, Retry Please.', 300, function () {
                                                            window.location.reload();
                                                        });
                                                    }
                                                });
                                            }
                                        });
                                    });

                                    // close
                                    $('#_access-news-close').click(function () {
                                        $.tableMultiOperate($('#news-table'), function (ids) {
                                            if (ids.length == 0) {
                                                $.showError('Select Item To Draft, First.', 300);
                                            } else {
                                                Api.Put('closeNews', {id: JSON.stringify(ids)}, function (object, error) {
                                                    console.log(object);
                                                    if (object['message'] && object['status_code'] && object['message'] == 'OK' && object['status_code'] == 200) {
                                                        $.showSuccess('Draft News Successfully.', 300, function () {
                                                            window.location.reload();
                                                        });
                                                    } else {
                                                        $.showError('Something Error, Retry Please.', 300, function () {
                                                            window.location.reload();
                                                        });
                                                    }
                                                });
                                            }
                                        });
                                    });
                                });
                            </script>
                        </div>
                    </div>
                </div>

            </div>

            <!-- Modal -->
            <div class="modal fade" id="confirmModal" aria-hidden="true" role="dialog" tabindex="-1">
                <div class="modal-dialog modal-center">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title"></h4>
                        </div>
                        <div class="modal-body">
                            <p></p>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                            <button type="button" class="btn btn-primary"></button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal fade" id="alertModal" aria-hidden="true" role="dialog" tabindex="-1">
                <div class="modal-dialog modal-center">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">×</span>
                            </button>
                            <h4 class="modal-title"></h4>
                        </div>
                        <div class="modal-body">
                            <p></p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- End Modal -->
        </div>
        <!-- End Page -->

        <!-- Footer -->
        <script type="text/javascript" src="../_resource/js/footer.js"></script>

        <script>
                                $.publish = function (obj) {
                                    var data = {};
                                    var url = SITE_URL + "/" + CURR_CONTROLLER + "/" + "publish";
                                    data.key = new Array();
                                    $("input[name=key]").each(function () {
                                        if ($(this).is(":checked")) {
                                            data.key.push(this.value);
                                        }
                                    })
                                    data.key = data.key.join(",");
                                    if (data.key == '') {
                                        $.showError('Please select the item');
                                        return false;
                                    }
                                    $.post(url, data, function (res) {
                                        if (!res.status) {
                                            $.showError(res.msg);
                                        } else {
                                            $.showSuccess(res.msg, function () {
                                                setTimeout(function () {
                                                    location.reload();
                                                }, 1000);
                                            })
                                        }

                                    })
                                }
        </script>
        <script>
            (function (document, window, $) {
                'use strict';

                var Site = window.Site;
                $(document).ready(function () {
                    Site.run();
                    $('textarea[maxlength]').maxlength({
                        threshold: 1000,
                        placement: 'bottom-left-inside'
                    });

                    $.components.register("datepicker", {mode: "default", defaults: {autoclose: !0}});

                    if (RUN_FUNCS.length > 0) {
                        for (var i = 0; i < RUN_FUNCS.length; i++) {
                            RUN_FUNCS[i].call();
                        }
                    }
                });
            })(document, window, jQuery);


        </script>
    </body>
</html>